<template>
  <div class='cartsMain1'>
      <!-- this is cartsMain1 -->
      <div v-for='item in carts'>
        {{item.id}}
        {{item.title}}
        <button @click='setCartBuyNumFn'>购买</button>
      </div>
      
  </div>
</template>

<script>
import {mapActions,mapState,mapMutations} from 'vuex'
export default {

  // 调用接收数据
  computed:{
    ...mapState({
      carts:state => state.carts.carts
    })
  },
  // 调用数据
  methods: {
    // 注意setCartsFn这是一个方法  1点击事件触发  2网页加载触发
    ...mapActions({
      // 普通方法名：‘模块名/方法名’
      setCartsFn:'carts/setCarts'
    }),
    ...mapMutations({
      setCartBuyNumFn:'carts/setCartBuyNum'
    })
  },
  created(){
    this.setCartsFn()
  }
}
</script>

<style scoped>

</style>
